﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Index2.aspx.cs" Inherits="Thksoft.Module.ApplyView.Apply.Index2" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>周资金计划申请</title>
    <link href="/CSS/Main.css" rel="stylesheet" />
    <link href="/App_Themes/MSN_Blue/default.css" rel="stylesheet" type="text/css" />
    <link href="/UserCotrols/My97DatePicker/skin/WdatePicker.css" rel="stylesheet" />
    <style type="text/css">
        #mydiv {
            border: 2px solid #2894FF;
            border-radius: 15px;
            -moz-border-radius: 15px;
            background-color: #F0F0F0;
        }

        #mytable tr {
            height: 40px;
            line-height: 40px;
        }

        #mytable .jjzj_righttd input {
            border: 1px soild blue;
        }

        #mytable tr td input, textarea {
            font-size: 12px;
            margin: 0;
            padding: 0;
            border: 1px solid #BAD4E1;
            text-indent: 8px;
            height: 20px;
        }
    </style>
</head>
<body>
    <form id="form1" runat="server">
    <%
        var user = User1;
        var company = new BLL.Sys_CompanyBLL().Find(user.USER_COMPANY);

        var CompanyName = company.CMY_NAME;
        //查询部门所有人
        var userIdStr = new BLL.Sys_UserBLL().GetUserIdByCompanyId((int)company.CMY_ID);
    %>

    <div id="app" style="margin: 0 auto; padding: 30px; width: 850px;">
    <p style="text-align: center; font-weight: bold; font-size: medium; color:#2894FF" >{{ApplyDate!=null?(ApplyDate.format('yyyy年MM月第')+WeekzIndex):''}}周资金计划申请</p><br />
    <div id="mydiv" style="width: 100%; text-align: center; padding-top: 20px;">
        <table id="mytable" border="0" cellpadding="0" cellspacing="0" width="100%">
            <tr>
                <td class="jjzj_lefttd">
                    <img src="/App_Themes/MSN_Blue/Images/jjzj_gs.png" style="vertical-align:middle" />&nbsp;&nbsp;公&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;司：
                </td>
                <td class="jjzj_righttd">
                    <label>{{CompanyName}}</label>
                </td>
                <td class="jjzj_lefttd">
                    <img src="/App_Themes/MSN_Blue/Images/jjzj_rq.png" style="vertical-align:middle" />&nbsp;&nbsp;周&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;期：
                </td>
                <td class="jjzj_righttd">
                    <template>
                        <thk-datepick v-model="ApplyDate" :placeholder="'选择日期'" :style="{width:'75px'}" :format="'yyyy-MM'" @change="DateChange('null')"></thk-datepick>
                    </template>
                    <select v-model="WeekzIndex" class="INPUT" @change="DateChange('Week')" style="width:75px; height:23px;border: 1px solid #BAD4E1;">
                        <template v-for="item in WeekData.Data">
                            <option v-if="item.Index<=WeekData.MaxWeekIndex" :value="item.Index">{{item.Name}}</option>
                        </template>
                    </select>
                    <span style="color: Red;">*</span>
                </td>
            </tr>
            <tr>
                <td class="jjzj_lefttd"><img src="/App_Themes/MSN_Blue/Images/jjzj_rq.png" style="vertical-align:middle" />&nbsp;&nbsp;起&nbsp;&nbsp;&nbsp;&nbsp;始&nbsp;&nbsp;&nbsp;&nbsp;日&nbsp;&nbsp;&nbsp;&nbsp;期：</td>
                <td class="jjzj_righttd" colspan="3">
                    <thk-datepick v-model="StartDate" :placeholder="'开始时间'" :style="{marginRight:'5px'}"></thk-datepick>-
                    <thk-datepick v-model="EndDate" :placeholder="'结束时间'" :style="{marginLeft:'5px'}"></thk-datepick>
                    <%--<input type="text" runat="server"  v-model="StartDateStr" class="Wdate INPUT" readonly="readonly" /> -
                    <input type="text" runat="server" v-model="EndDateStr" class="Wdate INPUT" readonly="readonly" /> --%>
                </td>
            </tr>
            <tr>
                <td class="jjzj_lefttd">
                    <img src="/App_Themes/MSN_Blue/Images/jjzj_yw.png" style="vertical-align:middle" />&nbsp;&nbsp;&nbsp;编制依据及事由：
                </td>
                <td class="jjzj_righttd" colspan="3">
                    <input placeholder="请输入编制依据及事由" v-model="Title" class="INPUT MAX" style="width:52.5%;" />
                    <span style="color: Red;">*</span>
                </td>
            </tr>
            <tr>
                <td class="jjzj_lefttd">
                    <img src="/App_Themes/MSN_Blue/Images/jjzj_zh.png" style="vertical-align:middle" />&nbsp;&nbsp;编&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;制&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;人：
                </td>
                <td class="jjzj_righttd" colspan="3">
                    <input placeholder="请点选编制人" v-model="BzUserNameStr" class="INPUT" disabled="disabled" style="width:52.5%;" />
                    <span style="color: Red;">*</span>
                </td>
            </tr>
            <tr>
                <td class="jjzj_lefttd">
                    <img src="/App_Themes/MSN_Blue/Images/jjzj_bz.png" style="vertical-align:middle" />&nbsp;&nbsp;备&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;注：
                </td>
                <td colspan="3" class="jjzj_righttd">
                    <div style="margin:8px 8px 8px 0;">
                        <textarea v-model="Remark" class="INPUT" style="width:95%;min-height:60px;height:100%;display:block;"></textarea>
                    </div>
                </td>
            </tr>
            <tr>
                <td style="text-align: center;" colspan="4">
                    <button @click="ApplyClick" class="bt_css_s" type="button">申请</button>
                </td>
            </tr>
        </table>
    </div>
</div>
    <script src="/Scripts/jquery.1.11.1.js" type="text/javascript"></script>
    <script src="/UserCotrols/My97DatePicker/WdatePicker.js" type="text/javascript"></script>
    <script src="/UserCotrols/My97DatePicker/开发包/lang/zh-cn.js" type="text/javascript"></script>
    <script src="/Scripts/Thk.Utility.js" type="text/javascript"></script>
    <script src="/Content/lib/jslinq/linq.js" type="text/javascript"></script>
    <script src="/Content/lib/vue/vue-2.5.17.min.js" type="text/javascript"></script>
    <script src="/Scripts/Thk.Component.js" type="text/javascript"></script>
    <script type="text/javascript">
        var vm = new Vue({
            el: '#app',
            data: {
                CompanyName: "<%=CompanyName %>",
                CompanyId: "<%=company.CMY_ID %>",
                ApplyDate: null,
                StartDate: null,
                EndDate: null,
                StartDateStr: null,
                EndDateStr: null,
                Title: "",
                BzUserNameStr: "<%=CompanyName %>- 所有部门",
                BzUserIdStr: "<%=userIdStr %>",
                Remark: "",
                WeekData: {
                    Data: [
                        { Index: 1, Name: "第一周" },
                        { Index: 2, Name: "第二周" },
                        { Index: 3, Name: "第三周" },
                        { Index: 4, Name: "第四周" },
                        { Index: 5, Name: "第五周" },
                        { Index: 6, Name: "第六周"}],
                    MaxWeekIndex: 5
                },
                WeekzIndex: 0
            },
            methods: {
                DateChange: function (option) {
                    if (option == 'Week') {

                    }
                    else {
                        //console.log("xx");
                        this.WeekzIndex = 1;
                        if (this.ApplyDate != null) {
                            this.WeekData.MaxWeekIndex = window.Helper.Date.GetWeekArry(this.ApplyDate).length;
                        }
                    }
                    var obj = window.Helper.Date.GetWeekSize(this.ApplyDate, this.WeekzIndex);
                    this.StartDate = obj.StartDate;
                    this.EndDate = obj.EndDate;
                    var weekIndex = parseInt(this.WeekzIndex);
                    var dt = this.StartDate;
                    this.StartDateStr = obj.StartDate.format("yyyy-MM-dd");
                    this.EndDateStr = obj.EndDate.format("yyyy-MM-dd");
                    this.Title = dt.format('yyyy-MM') + (weekIndex >= 10 ? weekIndex.toString() : ('0' + weekIndex.toString())) + "周资金计划申请(" + this.CompanyName + ")";
                },
                ApplyClick: function () {
                    var data = {};
                    data.Type = "Week";
                    data.Title = this.Title;
                    data.BzId = this.BzUserIdStr;
                    data.CompanyId = this.CompanyId;
                    data.Date = this.ApplyDate.format();
                    data.StartDate = this.StartDate.format();
                    data.EndDate = this.EndDate.format();
                    data.WeekIndex = this.WeekzIndex;
                    if ($.trim(data.Title) == "") {
                        alert("标题不能为空");
                        return;
                    }
                    $.ajax({
                        async: false,
                        type: "POST",
                        url: "/Module/ApplyView/ApplyHandler.ashx?MethodType=SubmitApplay",
                        data: JSON.stringify(data),
                        success: function (result) {
                            if (result.Type == 1) {
                                alert("申请成功");
                                return;
                            }
                            alert(result.Msg);
                            return;
                        },
                        erro: function () {
                            alert("网络或者服务异常");
                            return;
                        }
                    });
                }
            },
            mounted: function () {
                var that = this;
                that.ApplyDate = new Date();
                setTimeout(function () {
                    that.WeekzIndex = window.Helper.Date.GetWeekSizeByDate(that.ApplyDate).Index;
                    that.DateChange('Week');
                }, 10);
            }
        })
    </script>
    </form>
</body>
</html>